<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>管理员页面</title>
    <link rel="stylesheet" type="text/css" href="/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="/themes/icon.css">
    <script type="text/javascript" src="/jquery.min.js"></script>
    <script type="text/javascript" src="/jquery.easyui.min.js"></script>
</head>
<body>
<h2>睢宁农商行抽奖系统后台管理</h2>
<div style="margin:20px 0 10px 0;"></div>
<div class="easyui-tabs">
    <div title="About" style="padding:10px" >
        <div style="width:700px;height:500px">
            <p style="font-size:14px">抽奖基本功能</p>
            <ul>
                <li><a href="/">首页</a></li>
                <li><a href="/lottery">抽奖</a></li>
            </ul>
        </div>
    </div>

    <div title="奖品设置" style="padding:10px">
        <table id="dg" title="奖品" class="easyui-datagrid" style="width:700px;height:500px"
               url="/product/list"
               toolbar="#toolbar"
               rownumbers="true" fitColumns="true" singleSelect="true">
            <thead>
            <tr>
                <th field="name" width="50">奖品名称</th>
                <th field="weight" width = "20">中奖概率</th>
                <th field="amount" width = "20">奖品总数量</th>
                <th field="leftAmount">剩余奖品数量</th>
            </tr>
            </thead>
        </table>
    </div>
    <div title="中奖记录查询" data-options="closable:false" style="padding:10px">
        <table id="dg2" toolbar="#dg2toolbar"
               title="中奖记录" class="easyui-datagrid" style="width:700px;height:500px"
               url="/lotteryRecord/list"
               rownumbers="true" fitColumns="true" singleSelect="true">
            <thead>
            <tr>
                <th field="pname" width="50">产品名称</th>
                <th field="datetime">中奖时间</th>
            </tr>
            </thead>
        </table>
    </div>
</div>
<div id="toolbar">
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="addProduct()">添加奖品</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="editProduct()">修改奖品</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="destroyProd()">删除奖品</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-reload" plain="true" onclick="refreshProd()">刷新</a>
</div>

<div id="dg2toolbar">
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="clearRecord()">清空</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-reload" plain="true" onclick="refreshRecord()">刷新</a>
</div>

<div id="dlg" class="easyui-dialog" style="width:400px" data-options="closed:true,modal:true,border:'thin',buttons:'#dlg-buttons'">
    <form id="fm" method="post" novalidate style="margin:0;padding:20px 50px">
        <h3>奖品信息</h3>
        <div style="margin-bottom:10px">
            <input name="name" class="easyui-textbox" required="true" label="奖品名称:" style="width:100%">
        </div>
        <div style="margin-bottom:10px">
            <input name="weight" class="easyui-numberspinner" required="true" label="概率%:" data-options="min:0,max:100" style="width:100%">
        </div>
        <div id="amountDiv" style="margin-bottom:10px">
            <input id="amount" name="amount" class="easyui-numberspinner" required="true" label="奖品数量:" data-options="min:0,max:100000" style="width:100%">
        </div>
    </form>
</div>

<div id="dlg-buttons">
    <a href="javascript:void(0)" class="easyui-linkbutton c6" iconCls="icon-ok" onclick="saveProduct()" style="width:90px">保存</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-cancel" onclick="javascript:$('#dlg').dialog('close')" style="width:90px">取消</a>
</div>

<script>
    var url = "";
    //添加产品
    function addProduct(){
        $('#dlg').dialog('open').dialog('center').dialog('setTitle','新增奖品');
        $('#fm').form('clear');
        $('#amount').numberspinner('readonly',false);
        $("#amountDiv").show();
        url = '/product/addProduct';
    }
    function editProduct(){
        $("#amountDiv").hide();
        var row = $('#dg').datagrid('getSelected');
        $('#amount').numberspinner('readonly');
        if (row){
            $('#dlg').dialog('open').dialog('center').dialog('setTitle','修改奖品');
            $('#fm').form('load',row);
            url = '/product/updateProduct?id='+row.id;
        }
    }

    function saveProduct(){
        $('#fm').form('submit',{
            url: url,
            onSubmit: function(){
                return $(this).form('validate');
            },
            success: function(result){
                var result = eval('('+result+')');
                if (result.errorMsg){
                    $.messager.show({
                        title: 'Error',
                        msg: result.errorMsg
                    });
                }
                else {
                    $('#dlg').dialog('close');
                    $('#dg').datagrid('reload');
                }
            }
        });
    }


    function destroyProd() {
        var row = $('#dg').datagrid('getSelected');
        if (row) {
            $.messager.confirm('确认', '确定要删除吗?', function (r) {
                if (r) {
                    $.post('product/deleteById', {id: row.id}, function (result) {
                        if (result.success) {
                            $('#dg').datagrid('reload');    // reload the user data
                        } else {
                            $.messager.show({    // show error message
                                title: 'Error',
                                msg: result.msg
                            });
                        }
                    }, 'json');
                }
            });
        }
        else {
            $.messager.alert("提醒","请选中要删除的一个奖品");
        }
    }

    function refreshProd() {
        $('#dg').datagrid('reload');
    }

    function refreshRecord(){
        $('#dg2').datagrid('reload');
    }

    function clearRecord(){
        $.messager.confirm('确认', '确定要清空所有记录吗?', function (r) {
            if (r) {
                $.post('/lotteryRecord/clearRecord', {}, function (result) {
                    if (result.success) {
                        $('#dg2').datagrid('reload');    // reload the user data
                    }
                    else {
                        $.messager.show({    // show error message
                            title: 'Error',
                            msg: result.msg
                        });
                    }
                }, 'json');
            }
        });
    }
</script>
</body>

</html>